.nacho-drop-down {
  outline: none;

  &__trigger {
    &:focus {
      outline: none;
    }
  }

  &__active {
    color: get-color(blue7);

    &__toggle {
      color: get-color(blue7);
    }
  }

  &__options {
    $option-border-width: item-spacing(1) / 2;
    @include nacho-container;
    z-index: z(dropdown);
    list-style-type: none;
    margin-bottom: 0;
    padding: 0;
    min-width: item-spacing(7) * 2;

    &__option {
      margin-left: -1px;
      border-left: $option-border-width solid transparent;
      line-height: item-spacing(4) + 4;
      padding: item-spacing(2);
      color: get-color(black, 0.6);
      cursor: pointer;

      &--selected {
        border-left: $option-border-width solid get-color(blue7);
        color: get-color(blue7);
      }

      &:hover {
        background-color: get-color(blue0);
        color: get-color(blue7);
      }
    }
  }
}
